<!--
 * @Descripttion: 审核记录
 * @version: 
 * @Author: zhangjie
 * @Date: 2021-04-28 14:36:26
 * @LastEditors: wang pingqi
 * @LastEditTime: 2022-04-27 16:48:31
-->
<template>
  <KiFormDialog
    v-if="hotelName"
    :show.sync="row.show"
    class="dialog-channel"
    title="审核记录"
    readonly
    :before-close="()=>{ $emit('clearHotelId') }">
      <el-alert
        class="mb40"
        :title="hotelName"
        type="warning"
        :closable="false"
        center />
      <el-table
        stripe
        v-loading="row.loading"
        :data="row.data"
        border
        fit
        highlight-current-row
      >
        <el-table-column label="变更状态">
          <template slot-scope="{row:{reviewStatus}}">
            {{ reviewStatus | toReviewStatusName }}
          </template>
        </el-table-column>
        <el-table-column label="变更时间" prop="reviewTime"/>
        <el-table-column label="说明" prop="description"/>
        <el-table-column label="操作人" prop="reviewUserName"/>
      </el-table>
  </KiFormDialog>

</template>

<script>
export default {
  name: 'Record',
  props: {
  },
  watch: {
    '$attrs.id': {
      handler: function(newID) {
        if (newID) {
          this.hotelId = newID
          this.row.show = true
          this.queryReviewForPage()
          this.queryForDetail()
        }
      },
      immediate: true
    },
  },
  filters: {
    toReviewStatusName(v) {
      let o = {
        '1': '待审核', // _.data返回(1待审核 2审核未通过 3审核通过)
        '2': '审核未通过',
        '3': '审核通过',
        'df': ''
      }
      return o[v] || o['df']
    }
  },
  data () {
    return {
      hotelId: null,
      row: {
        show: false,
        loading: true,
        status: 'c',
        data: [],
      },
      hotelName: ''
    }
  },
  methods: {
    queryReviewForPage() {
      this.$POST('sot-admin-api/hotel/self-employed/queryReviewList', { 'hotelId': this.hotelId }).then(_ => {
        this.row.data = _.data
      }).finally(_ => {
        this.row.loading = false
      })
    },
    queryForDetail() {
      this.$POST('sot-admin-api/hotel/self-employed/queryForDetail', { 'id': this.hotelId }).then(_ => {
        this.hotelName = _.data?.hotelName
      })
    }
  }
}
</script>

<style lang="scss" scoped>
:deep(.dialog-channel) {
  .el-alert__title{
    font-size: 15px;
  }
}
</style>
